class Confirm {
    // Show confirm modal and callback({true | false})


    constructor(
        {
            body,
            heading = 'Confirm',
            cancel_text = "No",
            cancel_button_class = 'btn-secondary',
            confirm_text = 'Yes',
            confirm_button_class = 'btn-primary',
            type = "confirm",
            prompt_placeholder = "",
            modal_dialog_class = ""
        },
        callback = false, cancel_callback = false
    ) {
        this.body = body
        this.heading = heading
        this.cancel_text = cancel_text
        this.confirm_text = confirm_text
        this._id = this.constructor.makeid(16)
        this.callback = callback
        this.cancel_callback = cancel_callback
        this.type = type
        this.prompt_placeholder = prompt_placeholder
        this.modal = false
        this.prompt = false
        this.cancel_button_class = cancel_button_class
        this.confirm_button_class = confirm_button_class
        this.modal_dialog_class = modal_dialog_class
        var is_found = $('body').find(`#${this._id}`).length
        if (!is_found) {
            var obj = this.render()
            this.modal = obj.modal
            this.prompt = obj.prompt
        }
    }

    static makeid(length) {
        var result = [];
        var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
        var charactersLength = characters.length;
        for (var i = 0; i < length; i++) {
            result.push(characters.charAt(Math.floor(Math.random() * charactersLength)));
        }
        return result.join('');
    }

    static getTpyes() {
        return {
            prompt: 'prompt',
            confirm: 'confirm'
        }
    }

    render() {
        var prompt_body = ''
        if (this.type == this.constructor.getTpyes().prompt) {
            prompt_body = `
            <div class="form-group mt-3">
              <input type="text"
                class="form-control" name="" autocomplete="off"  id="${this._id}-prompt" placeholder="">
            </div>
            `
        }
        $('body').append(`
        <div class="modal fade" id="${this._id}" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog ${this.modal_dialog_class}" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">${this.heading}</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                    </div>
                    <div class="modal-body">
                        ${this.body}
                        ${prompt_body}
                    </div>
                    <div class="modal-footer">
                        <button type="button" id="${this._id}-cancel" class="btn ${this.cancel_button_class}" data-dismiss="modal">${this.cancel_text}</button>
                        <button type="button" id="${this._id}-confirm" class="btn ${this.confirm_button_class}">${this.confirm_text}</button>
                    </div>
                </div>
            </div>
        </div>
        `)

        $(`#${this._id}-cancel`).on('click', _ => {
            if (this.cancel_callback)
                this.cancel_callback(false, this.prompt.val(), this.prompt)
            this.promptReset()
        })
        $(`#${this._id}-confirm`).on('click', _ => {
            if (this.callback)
                this.callback(true, this.prompt.val(), this.prompt)
            this.promptReset()
            this.close()
        })
        return {
            modal: $(`#${this._id}`),
            prompt: $(`#${this._id}-prompt`)
        }
    }

    promptReset() {
        if (this.prompt) {
            this.prompt.val('')
        }
    }
    show(callback = false, cancel_callback = false) {
        if (callback) {
            this.callback = callback
        }
        if (cancel_callback) {
            this.cancel_callback = cancel_callback
        }
        this.modal.modal('show')
    }
    close(callback = false) {
        if (callback) {
            this.cancel_callback = callback
        }
        this.modal.modal('toggle')
    }

}